<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>交易增加</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/index.css">
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/index.js"></script>
    <script type="text/javascript" src="./js/tradeInfo.js"></script>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script src="js/token.js"></script>
    <script>
        TOKEN_VERIFY();
    </script>
</head>
<!--<body onload="loadSelect()">-->
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <form class="layui-form">
            <div class="layui-form-item">
                <label for="remark" class="layui-form-label">
                    <span class="x-red">*</span>注明</label>
                <div class="layui-input-inline">
                    <input type="text" id="remark" required="" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="paytime" class="layui-form-label">
                    <span class="x-red">*</span>到账时间</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="paytime"></div>
            </div>
            <div class="layui-form-item">
                <label for="company" class="layui-form-label">
                    <span class="x-red">*</span>业务相关单位</label>
                <div class="layui-input-inline">
                    <input type="text" id="company" required="" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="handler" class="layui-form-label">
                    <span class="x-red">*</span>汇款单位经办人</label>
                <div class="layui-input-inline">
                    <input type="text" id="handler" required="" lay-verify="pass" autocomplete="off"
                           class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="payee" class="layui-form-label">
                    <span class="x-red">*</span>收款单位</label>
                <div class="layui-input-inline">
                    <input type="text" id="payee" required="" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="receiver" class="layui-form-label">
                    <span class="x-red">*</span>收款人</label>
                <div class="layui-input-inline">
                    <input type="text" id="receiver" required="" lay-verify="pass" autocomplete="off"
                           class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="item" class="layui-form-label">用项</label>
                <div class="layui-input-inline">
                    <input type="text" id="item" required="" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="detail" class="layui-form-label">
                    <span class="x-red">*</span>品名</label>
                <div class="layui-input-inline">
                    <input type="text" id="detail" required="" lay-verify="pass" autocomplete="off"
                           class="layui-input"></div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label for="payType" class="layui-form-label">收支</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="payType" placeholder="请选择" value="" readonly="" class="layui-input layui-unselect">-->
<!--                    <i class="layui-edge"></i>-->
<!--                    <dl class="layui-anim layui-anim-upbit" style=""><dd lay-value="1" class="layui-this">顶部居左水印</dd><dd lay-value="2" class="">顶部居中水印</dd><dd lay-value="3" class="">顶部居右水印</dd><dd lay-value="4" class="">左居中水印</dd><dd lay-value="5" class="">居中水印</dd><dd lay-value="6" class="">右居中水印</dd><dd lay-value="7" class="">底部居左水印</dd><dd lay-value="8" class="">底部居中水印</dd><dd lay-value="9" class="">底部居右水印</dd></dl>-->
<!--&lt;!&ndash;                    <input type="text" id="payType" required="" autocomplete="off" class="layui-input">&ndash;&gt;-->
<!--                </div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <label class="layui-form-label">收支</label>
                <div class="layui-input-block">
                    <select name="payType" id="payType" lay-filter="position">
                        <option value="1">收入</option>
                        <option value="0">支出</option>
                    </select>
                    <div class="layui-unselect layui-form-select layui-form-selected">
                        <div class="layui-select-title">
                            <input type="text" placeholder="请选择" value="顶部居左水印" readonly="" class="layui-input layui-unselect">
                            <i class="layui-edge"></i>
                        </div>
                        <dl class="layui-anim layui-anim-upbit" style="">
                            <dd lay-value="1" class="layui-this">收入</dd>
                            <dd lay-value="0" class="">支出</dd>
                        </dl>
                    </div>
                </div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label for="bankName" class="layui-form-label">-->
<!--                    <span class="x-red">*</span>银行名称</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="bankName" required="" lay-verify="pass"-->
<!--                           autocomplete="off" class="layui-input"></div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">银行名称及卡号</label>
                    <div class="layui-input-inline">
                        <select id="bankName"></select>
                    </div>
                </div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label class="layui-form-label">银行名称</label>-->
<!--                <div class="layui-input-block">-->
<!--                    <select name="bankName" id="bankName" lay-filter="position">-->
<!--&lt;!&ndash;                        <option value="1">收入</option>&ndash;&gt;-->
<!--&lt;!&ndash;                        <option value="0">支出</option>&ndash;&gt;-->
<!--                    </select>-->
<!--                    <div class="layui-unselect layui-form-select layui-form-selected">-->
<!--                        <div class="layui-select-title">-->
<!--                            <input type="text" placeholder="请选择" value="" readonly="" class="layui-input layui-unselect">-->
<!--                            <i class="layui-edge"></i>-->
<!--                        </div>-->
<!--                        <dl class="layui-anim layui-anim-upbit" style="" id="bankName2">-->

<!--                        </dl>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
<!--            <div class="layui-form-item">-->
<!--                <label for="num" class="layui-form-label">-->
<!--                    <span class="x-red">*</span>卡号</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="num" required="" autocomplete="off" class="layui-input">-->
<!--                </div>-->
<!--                <div class="layui-form-mid layui-word-aux">-->
<!--                    <span class="x-red">*</span>银行卡后四位-->
<!--                </div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <label for="money" class="layui-form-label">
                    <span class="x-red">*</span>金额</label>
                <div class="layui-input-inline">
                    <input type="text" id="money" required="" lay-verify="pass"
                           autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="cash" class="layui-form-label">现金收支</label>
                <div class="layui-input-inline">
                    <input type="text" id="cash" required="" autocomplete="off"
                           class="layui-input"></div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label for="computerBalance" class="layui-form-label">-->
<!--                    <span class="x-red">*</span>电脑余额</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="computerBalance" required=""-->
<!--                           lay-verify="pass" autocomplete="off" class="layui-input"></div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <label for="infoBalance" class="layui-form-label">
                    <span class="x-red">*</span>信息余额</label>
                <div class="layui-input-inline">
                    <input type="text" id="infoBalance" required="false"
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
                <div class="layui-form-mid layui-word-aux">
                    <span class="x-red">*</span>如果银行是现金，可以不用填写此项</div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label for="reduceBalance" class="layui-form-label">-->
<!--                    <span class="x-red">*</span>余额差</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="reduceBalance" required=""-->
<!--                           lay-verify="pass" autocomplete="off" class="layui-input"></div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <label for="receiverPeo" class="layui-form-label">收货人</label>
                <div class="layui-input-inline">
                    <input type="text" id="receiverPeo" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="byPeo" class="layui-form-label">经办人</label>
                <div class="layui-input-inline">
                    <input type="text" id="byPeo" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="unitPrice" class="layui-form-label">单价</label>
                <div class="layui-input-inline">
                    <input type="text" id="unitPrice" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="number" class="layui-form-label">数量</label>
                <div class="layui-input-inline">
                    <input type="text" id="number" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="unit" class="layui-form-label">单位</label>
                <div class="layui-input-inline">
                    <input type="text" id="unit" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="expectMoney" class="layui-form-label">应收金额</label>
                <div class="layui-input-inline">
                    <input type="text" id="expectMoney" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
            <div class="layui-form-item">
                <label for="realMoney" class="layui-form-label">实收金额</label>
                <div class="layui-input-inline">
                    <input type="text" id="realMoney" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
<!--            <div class="layui-form-item">-->
<!--                <label for="leftMoney" class="layui-form-label">余款</label>-->
<!--                <div class="layui-input-inline">-->
<!--                    <input type="text" id="leftMoney" required=""-->
<!--                           lay-verify="pass" autocomplete="off" class="layui-input"></div>-->
<!--            </div>-->
            <div class="layui-form-item">
                <label for="infoMark" class="layui-form-label">备注</label>
                <div class="layui-input-inline">
                    <input type="text" id="infoMark" required=""
                           lay-verify="pass" autocomplete="off" class="layui-input"></div>
            </div>
        </form>
        <button class="layui-btn" onclick="addDeal()" style="margin-left:30px"><i class="layui-icon"></i>添加</button>
    </div>
</div>
<script>var _hmt = _hmt || [];
(function () {
    var hm = document.createElement("script");
    hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(hm, s);
})();</script>
</body>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/tradeInfo.js"></script>
<script>
    layui.use(['form'], function() {
        var $ = layui.$,
            form = layui.form;
        $.ajax({
            url: '/banks',
            type: 'get',
            headers: {
                'wrnm':localStorage.wrnm
            },
            data: {},
            success:function (res)
            {
                if(res.code!=200)
                {
                    if (res.message !== "") {
                        alert(res.message);
                    }
                    else {
                        alert("出现异常，请重试");
                    }
                }
                window.localStorage.setItem("bank", JSON.stringify(res.data));
                //动态渲染下拉框
                selectUtil.render({
                    id: 'bankName',
                    data: res.data
                });
            },
            error:function (res)
            {
                if (res.message !== "") {
                    alert(res.message);
                }
                else {
                    alert("出现异常，请重试");
                }
            }
        });
    });
</script>
<script>
    // 动态实现Layui下拉框工具方法
    var selectUtil = {
        render: function(param) {
            var $ = layui.$,
                form = layui.form;
            var id = param.id,
                prop = param.prop || {
                    id: 'id',
                    bankName: 'bankName',
                    num: 'num'
                },
                datas = param.data || [];
            var $select = $('#' + id);
            //重置下拉框
            $select.empty();
            $.each(datas, function(index, item) {
                if (item[prop.bankName] === "现金") {
                    var $option = $('<option value="' + item[prop.id] + '">' + item[prop.bankName] + ''+item[prop.id]+'</option>');
                } else {
                    var $option = $('<option value="' + item[prop.id] + '">' + item[prop.bankName] + ' '+item[prop.num]+'</option>');
                }
                $select.append($option);
            });
            form.render('select');
        }
    }
</script>
<script>
    layui.use('laydate', function () {
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#paytime' //指定元素，input的id
            ,value: new Date()//初始值为当前日期
            ,type: 'datetime'//时间格式 date表示 yyyy-MM-dd
        });
    });
</script>
</html>